<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>


    <ul id="ul1"><li>zs</li><li>ls</li><li>wu</li></ul>

    下标<input id="inputindex"><br>内容<input id="inputstr"><button onclick="changeli()">替换</button>

    <script>

        function changeli() {
            var inputIndexNode = document.getElementById("inputindex")
            var inputStrNode = document.getElementById("inputstr")


            var ulNode = document.getElementById("ul1")
            var liNode =  ulNode.childNodes[inputIndexNode.value ];


            var newTextNode  = document.createTextNode(inputStrNode.value)

            // replaceChild 给一个结点替换孩子
            // 参数1: 新孩子
            // 参数2: 旧孩子
            liNode.replaceChild(newTextNode, liNode.childNodes[0])

            inputIndexNode.value = "";
            inputStrNode.value = "";

        }

    </script>
</body>
</html>
